<template>
  <div class="new-pintuan">
    <Card>
      <Form ref="form" :model="form" :label-width="130" :rules="formValidate">
        <FormItem label="活动名称" prop="promotionName">
          <Input
            type="text"
            v-model="form.promotionName"
            placeholder="请填写活动名称"
            clearable
            style="width: 260px"
          />
        </FormItem>
        <FormItem label="活动开始时间及报名截止时间" prop="startTime">
          <DatePicker
            type="datetime"
            v-model="form.startTime"
            format="yyyy-MM-dd HH:mm:ss"
            placeholder="请选择"
            clearable
            style="width: 200px"
          >
          </DatePicker>
        </FormItem>
        <FormItem label="活动结束时间" prop="endTime">
          <DatePicker
            type="datetime"
            v-model="form.endTime"
            format="yyyy-MM-dd HH:mm:ss"
            placeholder="请选择"
            clearable
            style="width: 200px"
          >
          </DatePicker>
        </FormItem>
      </Form>
      <div>
        <Button type="text" @click="closeCurrentPage">返回</Button>
        <Button type="primary" :loading="submitLoading" @click="handleSubmit"
          >提交</Button
        >
      </div>
    </Card>
  </div>
</template>
<script>
import { savePintuan, editPintuan, getPintuanDetail } from "@/api/promotion";
import { specialOfferAdd } from "../../../api/promotion";
export default {
  data() {
    return {
      id: this.$route.query.id, // 拼团id
      form: {
        // 添加或编辑表单对象初始化数据
        promotionName: "",
        startTime: "",
        endTime: "",
      },
      // 表单验证规则
      formValidate: {
        promotionName: [{ required: true, message: "活动名称不能为空" }],
        startTime: [{ required: true, message: "请选择活动开始时间" }],
        endTime: [{ required: true, message: "请选择活动结束时间" }],
      },
      submitLoading: false, // 添加或编辑提交状态
      options: {
        // 不可选取时间
        disabledDate(date) {
          return date && date.valueOf() < Date.now() - 86400000;
        },
      },
    };
  },
  mounted() {
    if (this.id) {
      this.getDetail();
    }
  },

  methods: {
    // 关闭当前页面
    closeCurrentPage() {
      this.$store.commit("removeTag", "new-mztj");
      localStorage.storeOpenedList = JSON.stringify(
        this.$store.state.app.storeOpenedList
      );
      this.$router.go(-1);
    },
    // 提交活动
    handleSubmit() {
      this.$refs.form.validate((valid) => {
        if (valid) {
          this.submitLoading = true;
          let params = JSON.parse(JSON.stringify(this.form));
          // params.startTime = this.$options.filters.unixToDate(
          //   this.form.startTime
          // );

          // params.endTime = this.$options.filters.unixToDate(
          //   this.form.endTime
          // );
          if (params.startTime === "" || params.endTime === "") {
            this.$Message.error("活动时间不能为空");
            this.submitLoading = false;
            return;
          }
          if (params.startTime < new Date()) {
            this.$Message.error("活动开始时间不能小于当前时间");
            this.submitLoading = false;
            return;
          }
          if (!this.id) {
            // 添加 避免编辑后传入id等数据 记得删除
            delete params.id;
            specialOfferAdd(params).then((res) => {
              this.submitLoading = false;
              if (res.success) {
                this.$Message.success("拼团活动发布成功");
                this.closeCurrentPage();
              }
            });
          } else {
            // 编辑
            if (params.promotionGoodsList == "")
              delete params.promotionGoodsList;
            // editPintuan(params).then((res) => {
            //   this.submitLoading = false;
            //   if (res.success) {
            //     this.$Message.success("操作成功");
            //     this.closeCurrentPage();
            //   }
            // });
          }
        }
      });
    },
    // 获取详情
    getDetail() {
      getPintuanDetail(this.id).then((res) => {
        if (res.success) {
          const data = res.result;
          data.rangeTime = [];
          data.rangeTime.push(new Date(data.startTime), new Date(data.endTime));
          this.form = data;
          // 此处将值转换为 1 true ，0 false 不然ivew radio组件会报错
          this.form.fictitious
            ? this.$set(this.form, "fictitious", 1)
            : this.$set(this.form, "fictitious", 0);
        }
      });
    },
  },
};
</script>
<style lang="scss" scoped>
/deep/ .ivu-form-item {
  padding: 18px 10px !important;
}
</style>
